<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <title>登录界面</title>


    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

    <!-- jquery -->
    <script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>

    <script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
    <script type="text/javascript" th:src="@{/jquery-validation/jquery.validate.min.js}"></script>
    <script type="text/javascript" th:src="@{/jquery-validation/localization/messages_zh.min.js}"></script>
    <!-- layer -->
    <script type="text/javascript" th:src="@{/layer/layer.js}"></script>

    <!-- common.js -->
    <script type="text/javascript" th:src="@{/js/common.js}"></script>


    <link th:href="@{./login/css/default.css}" rel="stylesheet" type="text/css"/>
    <!--必要样式-->
    <link th:href="@{./login/css/styles.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{./login/css/demo.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{./login/css/loaders.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{./login/layui/css/layui.css}" rel="stylesheet" type="text/css"/>
</head>
<body>

<div class='login'>

    <form name="loginForm" id="loginForm" method="post" style="width:30%; margin:0 auto;">
        <div class='login_title'>
            <span>登   录</span>
        </div>
        <div class='login_fields'>
            <div class='login_fields__user'>
                <div class='icon'>
                    <img alt="" src='./login/img/user_icon_copy.png'>
                </div>
                <input id="mobile" name="mobile" type="text" placeholder="手机号码" required="true"
                       minlength="11" maxlength="11"/>
                <div class='validation'>
                    <img alt="" src='./login/img/tick.png'>
                </div>
            </div>
            <div class='login_fields__password'>
                <div class='icon'>
                    <img alt="" src='./login/img/lock_icon_copy.png'>
                </div>
                <!-- <input name="pwd" placeholder='密码' maxlength="16" type='text' autocomplete="off">-->
                <input id="password" name="password" type="password" placeholder="登录密码"
                       required="true" minlength="6" maxlength="16"/>
                <div class='validation'>
                    <img alt="" src='./login/img/tick.png'>
                </div>
            </div>
            <div class='login_fields__password'><!--
            <div class='icon'>
                <img alt="" src='./login/img/key.png'>
            </div>-->
                <!--<input name="code" placeholder='验证码' maxlength="4" type='text' autocomplete="off">-->
                <div class='validation' style="opacity: 1; right: -5px;top: -3px;">
                    <!-- <canvas class="J_codeimg" id="myCanvas" onclick="Code();">对不起，您的浏览器不支持canvas，请下载最新版浏览器!</canvas>-->
                </div>
            </div>
            <div class='login_fields__submit'>
                <input type='button' onclick="login()" value='登录'>
            </div>
        </div>
    </form>
    <div class='success'>
    </div>
    <div class='disclaimer'>
        <!-- <p>欢迎登陆后台管理系统</p>-->
        <p></p>
    </div>
</div>
<!--<script type="text/javascript" th:src="@{./login/js/jquery-ui.min.js}"></script>
<script type="text/javascript" th:src='@{./login/js/stopExecutionOnTimeout.js?t=1}'></script>
<script th:src="@{./login/layui/layui.js}" type="text/javascript"></script>
<script th:src="@{./login/js/Particleground.js}" type="text/javascript"></script>
<script th:src="@{./login/js/Treatment.js}" type="text/javascript"></script>
<script th:src="@{./login/js/jquery.mockjax.js}" type="text/javascript"></script>-->
<!-- jquery-validator -->
<script type="text/javascript" th:src="@{./login/js/jquery-ui.min.js}"></script>
<script th:src="@{./login/layui/layui.js}" type="text/javascript"></script>
<script th:src="@{./login/js/Particleground.js}" type="text/javascript"></script>
<script type="text/javascript" th:src="@{/js/md5.min.js}"></script>
<script type="text/javascript">
    var canGetCookie = 0;//是否支持存储Cookie 0 不支持 1 支持
    var ajaxmockjax = 1;//是否启用虚拟Ajax的请求响 0 不启用  1 启用
    //默认账号密码

    var truelogin = "18701797172";
    var truepwd = "123456";

    $(document).keypress(function (e) {
        // 回车键事件
        if (e.which == 13) {
            $('input[type="button"]').click();
        }
    });
    //粒子背景特效
    $('body').particleground({
        dotColor: '#E8DFE8',
        lineColor: '#1f7688'
    });
    layui.use('layer', function () {
        var msgalert = '默认账号:' + truelogin + '<br/> 默认密码:' + truepwd;
        var index = layer.alert(msgalert, {
            icon: 6,
            time: 4000,
            offset: 't',
            closeBtn: 0,
            title: '友情提示',
            btn: [],
            anim: 2,
            shade: 0
        });
        layer.style(index, {
            color: '#777'
        });
    });

    function login() {
        var inputPass = $("#password").val();
        var mobile = $("#mobile").val();
        if (!mobile) {
            layer.msg("手机号码不能为空!");
            return;
        }
        if (!inputPass) {
            layer.msg("登录密码不能为空!");
            return;
        }
        doLogin();
    }

    function doLogin() {
        g_showLoading();

        var inputPass = $("#password").val();
        var salt = g_passsword_salt;
        var str = "" + "" + salt.charAt(5) + salt.charAt(3) + inputPass + salt.charAt(2) + salt.charAt(4) + salt.charAt(1);
        var password = md5(str);

        $.ajax({
            url: "./login",
            type: "POST",
            data: {
                mobile: $("#mobile").val(),
                password: password
            },
            success: function (data) {
                layer.closeAll();
                if (data.code == 0) {
                    layer.msg("成功");
                    window.location.href = "./goods/index";
                } else {
                    layer.msg(data.message);
                }
            },
            error: function () {
                layer.closeAll();
            }
        });
    }


</script>


</body>
</html>
